<template>
  <el-row :gutter="10">
    <el-col :span="12">
      <totalDataArea type="product" name="商品" class="statistics">商品</totalDataArea>
      <div class="grid-content ep-bg-purple" />
    </el-col>
    <el-col :span="12">
      <totalDataArea type="user" name="用户">用户</totalDataArea>
      <div class="grid-content ep-bg-purple" />
    </el-col>
  </el-row>
  <!-- 可以放置图表的位置 -->
  <!-- <div class="box"></div> -->
  <LineChart />
</template>
<script setup>
  import totalDataArea from './TotalDataArea.vue';
  import LineChart from './LineChart.vue';
</script>
<style lang="scss">
  .el-row {
    margin-bottom: 20px;
  }
  .el-row:last-child {
    margin-bottom: 0;
  }
  .el-col {
    border-radius: 4px;
  }

  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .el-statistic {
    padding-left: 5px;
    box-shadow: 3px 3px 5px 1px #3f778c;
  }
  .el-row {
    min-width: 200px;
  }
</style>
